<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="img/logo.png">
    <link rel="stylesheet" href="css/index.css">
	<link rel="stylesheet" type="text/css" href="css/iconfont.css"/>
    <title>Sunshine 个人博客</title>
</head>
<body>
    
    <div id="main-container">
		<Header class="head">
		    <div class="dark-level"></div>
		    <div class="logo">
		        <a href="index.html"><img src="img/logo.png" alt="无法加载logo"></a>
		        <a href="index.html">Sunshine</a>
		    </div>
		    <div class="banner-text">
		        <h1>
		            会当凌绝顶<br>
		            一览众山小
		        </h1>
		    </div>
		</Header>
		<!-- 导航 -->
		 <nav class="main-nav">
			<a href="index.html" class="active">首页</a>
			<a href="javascript:void(0)"> 博文</a>
			<a href="javascript:void(0)">分类</a>
			<a href="javascript:void(0)">关于我</a>
		</nav>
		<!-- 主体部分 -->
		<div id="main">
			<!-- 开头图片 -->
			<div class="look-world">
				<h3 class="title">
					看世界
					<span class="litter-title">诗和远方 总有一天会和你不期而遇</span>
				</h3>
				<div class="all-img clear">
					<div class="img-item">
						<img src="img/index/sea.jpg" >
					</div>
					<div class="img-item">
						<img src="img/index/mountain.jpg" >
					</div>
					<div class="img-item">
						<img src="img/index/Grassland.jpg" >
					</div>
					<div class="img-item">
						<img src="img/index/woods.jpg" >
					</div>
					<div class="img-item">
						<img src="img/index/Countryside.jpg" >
					</div>
					<div class="img-item">
						<img src="img/index/earth.jpg" >
					</div>
				</div>
			</div>
			
			<div class="my-love">
				<h3 class="title">
					我喜欢
					<span class="litter-title">美好总是短暂难得但让人心醉</span>
				</h3>
				<div class="all-img clear">
					<div class="img-item">
						<img src="img/index/white_snake1.jpg" >
					</div>
					<div class="img-item">
						<img src="img/index/white_snake2.jpg" >
					</div>
					<div class="img-item">
						<img src="img/index/quan1.jfif" >
					</div>
					<div class="img-item">
						<img src="img/index/quan2.jfif" >
					</div>
				</div>
			</div>
			
			<div class="vLine">
				
			</div>
			<div class="my-word">
				<h3>记录生活，记录成长</h3>
				<h3>改变自己，改变幻想</h3>
			</div>
		</div>
		<footer class="my-footer clear">
			<p class="foot-text">
				Publish by xuzhaofei 2020.9
			</p>
			<div class="contact">
				<span class="iconfont icon-qq"></span>
				<span class="iconfont icon-weixinmw"></span>
				<span class="iconfont icon-gitee-fill-round"></span>
				<span class="iconfont icon-github"></span>
			</div>
		</footer>
    </div>
</body>
<script src="js/index.js"></script>
</html>